
import React, { Component } from 'react';
import { List } from 'antd';
import { ListProps } from 'antd/lib/list';

interface CustomListProps<T> extends ListProps<T> {
  /**
   * 渲染分割条
   */
  renderDivider?: (item: T, index: number) => React.ReactNode;
}

class CustomList<T> extends Component<CustomListProps<T>> {
  render() {
    const { dataSource, renderItem, renderDivider } = this.props;
    return (
      <List
        {...this.props}
        renderItem={renderItem ?
          (item, index) => {
            return (
              <>
                {
                  // 渲染Item
                  renderItem?.call(this, item, index)
                }
                {
                  // 渲染分隔条
                  index < (dataSource?.length ?? 0) - 1 ? renderDivider?.call(this, item, index) : null
                }
              </>
            );
          }
          : undefined}
      />
    );
  }
}

export default CustomList;